<template>
  <div>
    <el-input placeholder="输入关键字进行过滤" v-model="filterText"> </el-input>
    <el-tree
      class="filter-tree"
      :data="data"
      :props="defaultProps"
      node-key="menuid"
      default-expand-all
      :show-checkbox="showcheckbox"
      :filter-node-method="filterNode"
      ref="tree"
      @check="getCheckedKeys"
    >
    </el-tree>
  </div>
</template>


<script>
export default {
    props: ["showcheckbox","roleId"],
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    },
    // roleId(newValue,oldValue)
    'roleId': {
	      handler (newValue) {
        this.checked = [];
        this.$axios.get("/api/rbacRole/checked/"+newValue).then(res=>{
            console.log(res);
            if(res.data.code == 200){
                this.checked = res.data.data
            }
            this.$refs.tree.setCheckedKeys(this.checked);
        }
        ).catch();
    },
        immediate:true,
    },
  },
  created () {
      this.$axios("/api/rbacMenu/findAll").then(
          res=>{
              if (res.data.code == 200) {
                  console.log(res);
                  this.data = res.data.data
              }
          }
      ).catch();
  },

  methods: {
    filterNode(value, data) {
      if (!value) return true;
      return data.menuname.indexOf(value) !== -1;
    },
    getCheckedKeys() {
        //获取都选中的节点，包含半选节点 父id
        console.log(this.$refs.tree.getCheckedKeys());
        this.$emit("callFather", this.$refs.tree.getCheckedKeys());
      },
  },

  data() {
    return {
      filterText: "",
      data: [],
      checked:[],
      defaultProps: {
        children: "menus",
        label: "menuname",
      },
    };
  },
};
</script>